<script lang="ts" setup>
import Cell from '@/components/cp-cell.vue'
import { useUserStore } from '@/stores';
import {useRouter} from 'vue-router'
import {showConfirmDialog} from 'vant'
// 退出登录逻辑
const store = useUserStore()
const router = useRouter()
const loginOut = async () => {
  await showConfirmDialog({
    title: '温馨提示',
    message: '您确认要退出优医问诊吗？'
  }).then(() => {
    store.delUser()
    router.push('/login')
  }).catch(() => {
    console.log('取消')
  })
}
</script>

<template>
  <div class="nav">
    <cp-nav-bar left-text="设置"></cp-nav-bar>
  </div>
  <div class="body" >
    <Cell title="头像" :is-link="true" :inset="true"/>
    <Cell title="用户名" :is-link="true"/>
    <Cell title="手机号码" :is-link="true"/>
    <Cell title="修改密码" :is-link="true"/>
    <Cell title="微信" :is-link="true"/>
    <Cell title="关于我们" :is-link="true"/>
  </div>
  <div>
      <van-button type="danger" @click="loginOut"> 退出登录</van-button>
  </div>
</template>

<style lang="scss" scoped>
.body{
    padding-top: 50px;
    &a{
        position: absolute;
        top: 0;
    }
}
:deep() {
  .van-nav-bar {
    &__arrow {
      font-size: 18px;
      color: var(--cp-text1);
    }
    &__title {
      font-size: 20px;
      color:red
    }
  }
}
</style>

